<template>
  <vptBaseTable1001 :loading="loading" :columns="columns" :dataList="bugList" :pageIndex="pageIndex"
    :pageTotal="bugList.length"  :showPagination="false" :scrollbar="true"
    :scroll="scroll" :autoScroll="true">
    <!-- :onChangePageNumber="handelePage" -->
    <template #cell="{ record, column }">
      {{ getCellValue(record, column) }}
    </template>
    <template #summary-cell="{ record, column }">
      {{ getCellValue(record, column) }}
    </template>
  </vptBaseTable1001>
</template>
<script setup>
import { reactive, ref } from "vue";
import vptBaseTable1001 from "@/components/vpt-base-table-1001/index.vue";
import { addThousandsSeparator } from "@/utils/formatter.js";

const props = defineProps({
  pageIndex: {
    type: Number,
    default: 1,
  },
  bugList: { type: Array, default: () => { } },
});

const scroll = {
  y: "100%",
};

let loading = ref(false);

let columns = reactive([
  {
    title: "分模块情况",
    dataIndex: "business",
    // fixed: "left",
    tooltip: true,
    width: 140,
  },
  {
    title: "总数",
    dataIndex: "total_num",
    width: 100,
    align: "center"
  },
  {
    title: "缺陷率",
    dataIndex: "qxl",
    align: "center",
    width: 70
  },
  {
    title: "来源",
    width: 180,
    children: [
      {
        title: "迭代测试",
        tooltip: true,
        dataIndex: "ddcs",
        align: "center",
        width: 90
      },
      {
        title: "运维工单",
        tooltip: true,
        dataIndex: "ywgd",
        align: "center",
        width: 90
      },
    ],
  },
  {
    title: "缺陷等级",
    width: 300,
    children: [
      {
        title: "致命",
        dataIndex: "zmbug",
        align: "center",
        cellClass: "zmbug",
        width: 60
      },
      {
        title: "严重",
        dataIndex: "yzbug",
        align: "center",
        cellClass: "yzbug",
        width: 60
      },
      {
        title: "一般",
        align: "center",
        dataIndex: "ybbug",
        cellClass: "ybbug",
        width: 60
      },
      {
        title: "提示",
        align: "center",
        dataIndex: "tsbug",
        cellClass: "tsbug",
        width: 60
      },
      {
        title: "建议",
        align: "center",
        dataIndex: "jybug",
        width: 60
      },
    ],
  },
  {
    title: "解决情况",
    width: 280,
    children: [
      {
        title: "已解决",
        align: "center",
        dataIndex: "yjj",
        width: 70
      },
      {
        title: "解决中",
        align: "center",
        dataIndex: "jjz",
        width: 70
      },
      {
        title: "待确定",
        align: "center",
        dataIndex: "dqd",
        width: 70
      },
      {
        title: "转需求",
        align: "center",
        dataIndex: "zxq",
        width: 70
      },
    ],
  },
]);
// let total = ref(100);
const emit = defineEmits(["handelePage"]);

const handelePage = () => {
  emit("handelePage", value);
};

const getCellValue = (record, column) => {
  if (column.dataIndex === 'ddcs') return record[column.dataIndex]
  return addThousandsSeparator(record[column.dataIndex])
}
</script>
<style lang="less">
.zmbug .arco-table-td-content {
  color: #f53f3f !important;
}

.yzbug .arco-table-td-content {
  color: #ff7d00 !important;
}

.ybbug .arco-table-td-content {
  color: #ffc400 !important;
}

.tsbug .arco-table-td-content {
  color: #57c5ff !important;
}
</style>
